﻿<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="Themeum">

<!-- Include All Css -->
<link rel="stylesheet" href="../static/css/font-awesome.min.css">
<link rel="stylesheet" href="../static/css/bootstrap.min.css">
<link rel="stylesheet" href="../static/css/animate.css">
<link rel="stylesheet" href="../static/css/fonts.css">
<link rel="stylesheet" href="../static/css/preset.css">
<link rel="stylesheet" href="../static/css/style.css">
<link rel="stylesheet" href="../static/css/responsive.css">

<!--[if lt IE 9]>
	<script src="js/html5shive.js"></script>
<![endif]-->

</head>
<body>
<!-- Header Area -->
<header class="header-area inner-page">
	<!-- Header Top Area -->
	<section class="header-top">
		<div class="container">
			<div class="row">
				<div class="col-sm-12 col-xs-12">
					<div class="header-elements pull-right">
						<ul class="social-icon pull-left">
							<li><a href="#"><i class="fa fa-facebook"></i></a></li>
							<li><a href="#"><i class="fa fa-twitter"></i></a></li>
							<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
							<li><a href="#"><i class="fa fa-instagram"></i></a></li>
						</ul>
						<div class="language pull-left">
							<a href="#">
								<i class="icon-translator"></i>
								<span>English</span>
								<i class="fa fa-angle-down"></i>
							</a>
						</div>
						<div class="login-or-signup pull-left">
							<a href="#"><i class="icon-user"></i><span>Login/sign up</span></a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- /.header-top -->
	<nav class="navigation">
		<div class="container">
			<div class="row">
				<div class="col-sm-12 col-xs-12">
					<div class="logo pull-left">
						<a href="index.html"><img alt="Kidzy" src="../static/images/home1/logo.png"></a>
					</div>
					<ul class="main-menu pull-right">
						<li class="menu-has-child">
							<a href="index.html">Home</a>
							<ul>
								<li><a href="index2.html">Home 2</a></li>
								<li><a href="index3.html">Home 3</a></li>
							</ul>
						</li>
						<li><a href="about-us.html">About us</a></li>
						<li class="menu-has-child">
							<a href="#">Pages</a>
							<ul>
								<li>
									<a href="event.html">Event</a>
									<ul>
										<li><a href="event-details.html">Event Details</a></li>
									</ul>
								</li>
								<li><a href="routine.html">Routine</a></li>
								<li><a href="contact.html">Contact</a></li>
								<li><a href="404.html">404</a></li>
								<li><a href="coming-soon.html">Coming Soon</a></li>
							</ul>
						</li>
						<li><a href="shortcode.html">Features</a></li>
						<li class="menu-has-child">
							<a href="class.html">Classes</a>
							<ul>
								<li><a href="class-details.html">Classes Details</a></li>
							</ul>
						</li>
						<li class="menu-has-child">
							<a href="blog.html">Blog</a>
							<ul>
								<li><a href="blog-details.html">Blog Details</a></li>
							</ul>
						</li>
						<li class="menu-has-child">
							<a href="teacher.html">Teacher</a>
							<ul>
								<li><a href="teacher-details.html">Teacher Details</a></li>
							</ul>
						</li>
						<li>
							<a href="#" id="search-pop"><i class="fa fa-search"></i></a>
						</li>
					</ul>
					<div class="mobile-menu hidden-lg hidden-md hidden-sm">
						<span></span>
						<span></span>
						<span></span>
						<span></span>
					</div>
				</div>
			</div>
		</div>
		<div class="search-area">
			<form action="#" method="post">
				<input type="search" name="search" placeholder="Enter your Search Text Here....">
			</form>
			<a href="#" class="search-close"><i class="fa fa-times"></i></a>
		</div>
	</nav>
</header>
<!-- /.header-area -->

<!-- Breadcrumb  -->
<section class="breadcrumb-section">
	<div class="container">
		<div class="row">
			<div class="col-sm-12 col-xs-12 text-center">
				<div class="breadcrumb-content">
					<h2>Shortcode</h2>
					<ul>
						<li><a href="index.html">Home</a><span>/</span></li>
						<li>Shortcode</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- /.breadcrumb-section  -->

<!-- Shortcode Section -->
<section class="shortcodes-section">
	<div class="container">
		<div class="row">
			<div class="col-sm-12 col-xs-12">
				<div class="single-button">
					<a href="#" class="primary-btn large"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn medium"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn small"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn"><span>Enroll Your Child</span></a>
				</div>
				<div class="colored-button">
					<a href="#" class="primary-btn bg1"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg2"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg3"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg4"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg5"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg6"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg7"><span>Enroll Your Child</span></a>
					<a href="#" class="primary-btn bg8"><span>Enroll Your Child</span></a>
				</div>
				<div class="features-center">
					<div class="row">
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility">
								<i class="icon-trophy"></i>
								<h4>Pre-School Sports</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility two">
								<i class="icon-food"></i>
								<h4>Healthy Meals</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility three">
								<i class="icon-play"></i>
								<h4>Multimedia Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility four">
								<i class="icon-color"></i>
								<h4>Music And Art Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
					</div>
				</div>
				<div class="features-left">
					<div class="row">
						<div class="col-sm-3 col-xs-12 text-left">
							<div class="single-facility">
								<i class="icon-trophy"></i>
								<h4>Pre-School Sports</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-left">
							<div class="single-facility two">
								<i class="icon-food"></i>
								<h4>Healthy Meals</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-left">
							<div class="single-facility three">
								<i class="icon-play"></i>
								<h4>Multimedia Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-left">
							<div class="single-facility four">
								<i class="icon-color"></i>
								<h4>Music And Art Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
					</div>
				</div>
				<div class="features-ico-bg">
					<div class="row">
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility">
								<i class="icon-trophy"></i>
								<h4>Pre-School Sports</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility">
								<i class="icon-food"></i>
								<h4>Healthy Meals</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility">
								<i class="icon-play"></i>
								<h4>Multimedia Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
						<div class="col-sm-3 col-xs-12 text-center">
							<div class="single-facility">
								<i class="icon-color"></i>
								<h4>Music And Art Class</h4>
								<p>Lorem ipsum dolor sit amet,consectetur adipisicing.</p>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-sm-6 col-xs-12">
				<div class="tab-style-one">
					<!-- Nav tabs -->
					<ul class="tab-nav" role="tablist">
						<li role="presentation" class="active"><a href="#one" aria-controls="one" role="tab" data-toggle="tab">Title One</a></li>
						<li role="presentation"><a href="#two" aria-controls="two" role="tab" data-toggle="tab">Title Two</a></li>
						<li role="presentation"><a href="#three" aria-controls="three" role="tab" data-toggle="tab">Title Three</a></li>
						<li role="presentation"><a href="#four" aria-controls="four" role="tab" data-toggle="tab">Title Four</a></li>
					</ul>
					<div class="tab-content">
						<div role="tabpanel" class="tab-pane fade in active" id="one">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="two">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="three">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="four">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
					</div>
				</div>
			</div>
			<div class="col-sm-6 col-xs-12">
				<div class="tab-style-two">
					<!-- Nav tabs -->
					<ul class="tab-nav2" role="tablist">
						<li role="presentation" class="active"><a href="#one2" aria-controls="one2" role="tab" data-toggle="tab">Title One</a></li>
						<li role="presentation"><a href="#two2" aria-controls="two2" role="tab" data-toggle="tab">Title Two</a></li>
						<li role="presentation"><a href="#three2" aria-controls="three2" role="tab" data-toggle="tab">Title Three</a></li>
						<li role="presentation"><a href="#four2" aria-controls="four2" role="tab" data-toggle="tab">Title Four</a></li>
					</ul>
					<div class="tab-content">
						<div role="tabpanel" class="tab-pane fade in active" id="one2">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="two2">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="three2">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
						<div role="tabpanel" class="tab-pane fade" id="four2">
							<p>
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
								do eiusmod tempor incididunt ut labore et dolore magna aliqua.
								Ut enim ad minim veniam, quis nostrud exercitation ullamco 
								laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
								irure dolor in reprehenderit in voluptate velit esse cillum
								dolore eu fugiat nulla pariatur.
							</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col-sm-6 col-xs-12">
				<div class="accordion-one">
					<h4>Accordion Style One</h4>
					<div class="panel-group" id="accordion" role="tablist">
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingOne">
								<h4 class="panel-title">
									<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-controls="collapseOne">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingTwo">
								<h4 class="panel-title">
									<a role="button" class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-controls="collapseTwo">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingThree">
								<h4 class="panel-title">
									<a role="button" class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-controls="collapseThree">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-sm-6 col-xs-12">
				<div class="accordion-two">
					<h4>Accordion Style Two</h4>
					<div class="panel-group" id="accordion2" role="tablist">
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingOne2">
								<h4 class="panel-title">
									<a role="button" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne2" aria-controls="collapseOne2">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseOne2" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne2">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingTwo2">
								<h4 class="panel-title">
									<a role="button" class="collapsed" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo2" aria-controls="collapseTwo2">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseTwo2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo2">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
						<div class="panel panel-default" role="tab" >
							<div class="panel-heading" id="headingThree2">
								<h4 class="panel-title">
									<a role="button" class="collapsed" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree2" aria-controls="collapseThree2">
										Does not reflect adjustments for fees, costs, or medical liens
									</a>
								</h4>
							</div>
							<div id="collapseThree2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree2">
								<div class="panel-body">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>

<!-- Footer Section -->
<footer class="footer-section">
	<div class="container">
		<div class="row">
			<div class="col-md-4 col-sm-6 col-xs-12 text-left">
				<div class="about-widget">
					<div class="footer-logo">
						<a href="index.html"><img alt="" src="../static/images/home1/footer-logo.png"></a>
					</div>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do 
						eiusmod tempor incididunt ut labore.
					</p>
					<span>&copy; 2016 Kidzy School</span>
					<ul class="social-icon">
						<li><a href="#"><i class="fa fa-facebook"></i></a></li>
						<li><a href="#"><i class="fa fa-twitter"></i></a></li>
						<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
						<li><a href="#"><i class="fa fa-instagram"></i></a></li>
					</ul>
				</div>
			</div>
			<div class="col-md-2 col-sm-6 col-xs-12 text-left">
				<div class="footer-widget">
					<h3>Qucik Link</h3>
					<ul>
						<li><a href="#">Home</a></li>
						<li><a href="#">About</a></li>
						<li><a href="#">Gallery</a></li>
						<li><a href="#">Blog</a></li>
						<li><a href="#">Contact</a></li>
					</ul>
				</div>
			</div>
			<div class="col-md-2 col-sm-6 col-xs-12 text-left">
				<div class="footer-widget">
					<h3>Classes</h3>
					<ul>
						<li><a href="#">Happy Kiddo</a></li>
						<li><a href="#">Junior Lambs</a></li>
						<li><a href="#">Master Mind</a></li>
						<li><a href="#">Rabbit House</a></li>
						<li><a href="#">Terrific Tigers</a></li>
					</ul>
				</div>
			</div>
			<div class="col-md-4 col-sm-6 col-xs-12">
				<div class="footer-widget">
					<h3>Newsletter</h3>
					<p>Copyright &copy; 2016.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
					<form action="#" method="post" class="subscribe-form">
						<input type="email" name="email" placeholder="Your email Id">
						<button class="primary-btn pull-right"><span>Submit</span></button>
						<div class="clearfix"></div>
					</form>
				</div>
			</div>
		</div>
	</div>
</footer>
<!-- /.footer-section -->

<!-- Include All JavaScript -->
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<script src="../static/js/mixIt.js"></script>
<script src="../static/js/main.js"></script>
</body>
</html>

